<template>
  <div class="no-data">
    <img :src="img" :style="{width: width + 'px', height: height + 'px'}" alt />
    <p>{{ msg }}</p>
    <slot name="btn"></slot>
  </div>
</template>

<script>
export default {
  name: 'NoData',
  props: {
    msg: {
      type: String,
      default: '暂无数据'
    },
    width: {
      type: [Number, String],
      default: 200
    },
    height: {
      type: [Number, String],
      default: 200
    },
    img: {
      type: String,
      default:
        'https://canpoint-static.oss-cn-beijing.aliyuncs.com/live-class/auto-img.png'
    }
  }
}
</script>

<style lang="less" scoped>
.no-data {
  width: 100px;
  padding: 50px 0;
  margin: 0 auto;
  text-align: center;
  img {
    display: block;
  }
  p {
    padding-top: 15px;
    color: #999;
  }
}
</style>
